<template>
	<view class="change-password-view">
		<u--form labelPosition="left" ref="form" labelWidth="270rpx" :model="form" :rules="rules">
			<view class="content-view">
				<u-form-item label="工作负责人" prop="workManage" @click="peopleClick('1')">
					<u--input placeholder="请选择工作负责人(选择一位)" border="none" v-model="form.workManage"
						suffixIcon="arrow-right">
					</u--input>
				</u-form-item>

				<u-form-item label="监理人" prop="supervisor" @click="peopleClick('2')">
					<u--input placeholder="请选择监理人(可多选)" border="none" v-model="form.supervisor"
						suffixIcon="arrow-right">
					</u--input>
				</u-form-item>

				<u-form-item label="督查人员" prop="supManagePerson" @click="peopleClick('3')">
					<u--input placeholder="请选择督查人员(可多选)" border="none" v-model="form.supManagePerson"
						suffixIcon="arrow-right">
					</u--input>
				</u-form-item>

				<u-form-item label="到岗到位人员" prop="dgr" @click="peopleClick('4')">
					<u--input placeholder="请选择到岗到位人员(可多选)" border="none" v-model="form.dgr" suffixIcon="arrow-right">
					</u--input>
				</u-form-item>

				<view>
					<view style="margin-top: 30rpx;width: 100%;">
						变更作业人员原因
					</view>
					<view style="margin-top: 20rpx;">
						<u--textarea class="textarea" v-model="form.changePeopleReason" border="none" height="200rpx"
							@input="textareaFlag= false" placeholder="请填写变更作业人员原因 (必填)" count maxlength="150">
						</u--textarea>
					</view>
				</view>
			</view>
			<view v-if="textareaFlag" style="color: red;font-size: 12px;padding-left: 40rpx;margin-top: 10rpx;">
				请填写变更作业人员原因
			</view>
		</u--form>
		<view class="btn-view">
			<view class="cancelBtn">取消</view>
			<view class="sureBtn" @click="sureBtn">确定</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				form: {
					workPlanId:'',
					workType:"",
					workManageId:"",
					workManage: '',
					supervisorId:"",
					supervisor: '',
					supManagePersonId:"",
					supManagePerson: '',
					dgrId:"",
					dgr: '',
					changePeopleReason:''
				},
				rules: {

				},
				textareaFlag: false,
			}
		},
		// 上个页面编辑传来的值
		onLoad(options) {
			this.getAppWorkPlanDetailInfo(options.workPlanId)
			
			// 更新选中工作负责人
			uni.$on('oneRadio', (projectObj) => {
				this.form.workManageId = projectObj.id
				this.form.workManage = projectObj.userName
			})
			//更新选中的监理人
			uni.$on('towRadio', (projectArr) => {
				let id = ''
				let str = ''
				projectArr.forEach((item) => {
					id += item.id + ','
					str += item.userName + ','
				})
				this.form.supervisorId = id.substring(0, id.lastIndexOf(','))
				this.form.supervisor = str.substring(0, str.lastIndexOf(','))
			})
			
			// 更新选中的督查人员
			uni.$on('threeRadio', (projectArr) => {
				let id = ''
				let str = ''
				projectArr.forEach((item) => {
					id += item.id + ','
					str += item.userName + ','
				})
				this.form.supManagePersonId = id.substring(0, id.lastIndexOf(','))
				this.form.supManagePerson = str.substring(0, str.lastIndexOf(','))
			})
			
			// 更新选中到岗人员 
			uni.$on('fourRadio', (projectArr) => {
				let id = ''
				let str = ''
				projectArr.forEach((item) => {
					id += item.id + ','
					str += item.userName + ','
				})
				this.form.dgrId = id.substring(0, id.lastIndexOf(','))
				this.form.dgr = str.substring(0, str.lastIndexOf(','))
			})
		},
		methods: {
			getAppWorkPlanDetailInfo(val) {
				let that = this
				let params = {
					workPlanId: val
				}
				that.request(that.$api.getAppWorkPlanDetailInfo, params, 'POST').then((res) => {
					if (res) {
						this.form.workPlanId = res.resultValue.items[0].workPlanId
						this.form.workType = res.resultValue.items[0].workType
						this.form.workManageId = res.resultValue.items[0].workManageId
						this.form.workManage = res.resultValue.items[0].workManage
						this.form.supervisorId = res.resultValue.items[0].supervisorId
						this.form.supervisor = res.resultValue.items[0].supervisor
						this.form.supManagePerson = res.resultValue.items[0].supManagePerson
						this.form.dgrId = res.resultValue.items[0].dgrId
						this.form.dgr = res.resultValue.items[0].dgr
						this.form.changePeopleReason = res.resultValue.items[0].changePeopleReason

					}
				})
			},
			peopleClick(val) {
				let selfFlag = ''
				if(uni.getStorageSync('userInfo').unitLevel!==1){
					selfFlag = 1
				}
				// 负责人 单选
				if (val == 1) {
					uni.navigateTo({
						url: '../selectChangePeople/selectChangePeople?flag=' + val +'&selfFlag=' + selfFlag
					})
					// 监理人多选
				} else if (val == 2) {
					uni.navigateTo({
						url: '../selectChangePeople/selectChangePeople?flag=' + val +'&selfFlag=' + selfFlag
					})
					// 督查人多选
				} else if (val == 3) {
					uni.navigateTo({
						url: '../selectChangePeople/selectChangePeople?flag=' + val +'&selfFlag=' + selfFlag
					})
					// 到岗人多选
				} else {
					uni.navigateTo({
						url: '../selectChangePeople/selectChangePeople?flag=' + val +'&selfFlag=' + selfFlag
					})
				}
			},
			sureBtn() {
				let that = this
				if (this.form.changePeopleReason == '') {
					this.textareaFlag = true
					return
				} else {
					let params = that.form
					that.request(that.$api.changeWorkPeople, params, 'POST').then((res)=>{
						if(res.code == 200) {
							uni.$u.toast(res.resultValue)
							setTimeout(()=>{
								uni.navigateBack();
							},1500)
						} else {
							uni.$u.toast(res.resultValue)
						}
					})
				}
			},
		}
	}
</script>

<style scoped>
	.change-password-view {
		height: 100vh;
		background: #F1F2F5;
		box-sizing: border-box;
		padding: 20rpx 0;
	}

	.content-view {
		padding: 0 18rpx 0 40rpx;
		background: white;
	}

	.content-item {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 28rpx 0;
		border-bottom: 2rpx solid #F5F5F5;
	}

	.content-item-left {
		width: 270rpx;
		font-size: 32rpx;
		color: #333333;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
	}

	.content-item-right {
		width: calc(100% - 270rpx);
		display: flex;
		justify-content: flex-end;
		font-size: 32rpx;
		color: #666666;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
	}

	.textStyle {
		width: calc(100% - 32rpx);
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
		text-align: right;
	}

	.btn-view {
		padding: 80rpx 40rpx 0;
		box-sizing: border-box;
		display: flex;
		width: 100%;
	}

	.cancelBtn {
		width: 50%;
		height: 80rpx;
		border: 2rpx solid #3473F9;
		color: #3473F9;
		box-sizing: border-box;
		text-align: center;
		line-height: 80rpx;
		border-radius: 14rpx;
		font-size: 32rpx;
	}

	.sureBtn {
		width: 50%;
		height: 80rpx;
		background-color: #3473F9;
		color: #fff;
		text-align: center;
		line-height: 80rpx;
		margin-left: 20rpx;
		border-radius: 14rpx;
		font-size: 32rpx;
	}

	.textarea {
		width: 100%;
		height: 300rpx;
		box-sizing: border-box;
		border: none !important;
		padding-left: 0;
	}
	>>>.uni-input-input {
		text-align: right!important;
	}
</style>
